<script setup lang="ts"></script>

<template>
  <div class="tip">
    <!-- 常见科室 -->
    <div class="deparment">
      <div class="header">
        <div class="left">
          <svg
            t="1690022262855"
            class="icon"
            viewBox="0 0 1024 1024"
            version="1.1"
            xmlns="http://www.w3.org/2000/svg"
            p-id="1612"
            width="16"
            height="16"
          >
            <path
              d="M400.696008 129.093147c-17.248849 0-31.233352 13.984503-31.233352 31.233352l0 30.470989c0 17.248849 13.984503 31.233352 31.233352 31.233352s31.233352-13.984503 31.233352-31.233352l0-30.470989C431.92936 143.078673 417.944857 129.093147 400.696008 129.093147z"
              fill="#f87c03"
              p-id="1613"
            ></path>
            <path
              d="M623.647823 129.093147c-17.248849 0-31.233352 13.984503-31.233352 31.233352l0 30.470989c0 17.248849 13.985526 31.233352 31.233352 31.233352 17.248849 0 31.233352-13.984503 31.233352-31.233352l0-30.470989C654.881175 143.078673 640.896672 129.093147 623.647823 129.093147z"
              fill="#f87c03"
              p-id="1614"
            ></path>
            <path
              d="M425.695379 312.937269c11.209296 18.047028 41.974997 48.588625 86.152149 48.588625 43.958164 0 75.100442-30.308283 86.573751-48.223305 9.302877-14.528901 5.068436-33.846876-9.455349-43.149752-14.539134-9.307993-33.851992-5.063319-43.149752 9.455349-0.121773 0.198521-13.379729 19.449981-33.968649 19.449981-19.993357 0-32.428573-18.107403-33.271778-19.373233-9.17087-14.417361-28.28009-18.799158-42.829458-9.760295C421.089477 279.028994 416.591023 298.28557 425.695379 312.937269z"
              fill="#f87c03"
              p-id="1615"
            ></path>
            <path
              d="M564.242851 625.945145l-20.278859 0L543.963992 462.486306c0-17.253966-13.985526-31.233352-31.233352-31.233352-17.248849 0-31.233352 13.979386-31.233352 31.233352l0 163.457816-20.283975 0c-45.924959 0-83.289961 37.363979-83.289961 83.289961l0 103.024421c0 45.924959 37.363979 83.289961 83.289961 83.289961l103.029538 0c45.924959 0 83.289961-37.363979 83.289961-83.289961L647.532813 709.234083C647.532813 663.309124 610.168834 625.945145 564.242851 625.945145zM585.066109 812.258505c0 11.286044-9.537214 20.822235-20.822235 20.822235L461.214337 833.080739c-11.286044 0-20.822235-9.537214-20.822235-20.822235L440.392102 709.234083c0-11.286044 9.537214-20.822235 20.822235-20.822235l103.029538 0c11.286044 0 20.822235 9.537214 20.822235 20.822235L585.066109 812.258505z"
              fill="#f87c03"
              p-id="1616"
            ></path>
            <path
              d="M250.808256 625.945145l-17.482163 0 0-266.970354c0-35.483142 28.864398-64.35368 64.343447-64.35368 17.248849 0 31.233352-13.984503 31.233352-31.233352s-13.985526-31.233352-31.233352-31.233352c-69.924559 0-126.810151 56.890708-126.810151 126.820384l0 266.970354-23.079648 0c-45.924959 0-83.289961 37.363979-83.289961 83.289961l0 103.024421c0 45.924959 37.363979 83.289961 83.289961 83.289961l103.029538 0c45.924959 0 83.289961-37.363979 83.289961-83.289961L334.099241 709.234083C334.098217 663.309124 296.734238 625.945145 250.808256 625.945145zM271.630491 812.258505c0 11.286044-9.537214 20.822235-20.822235 20.822235L147.778718 833.080739c-11.286044 0-20.822235-9.537214-20.822235-20.822235L126.956484 709.234083c0-11.286044 9.537214-20.822235 20.822235-20.822235l103.029538 0c11.286044 0 20.822235 9.537214 20.822235 20.822235L271.630491 812.258505z"
              fill="#f87c03"
              p-id="1617"
            ></path>
            <path
              d="M876.565113 625.945145l-21.961174 0 0-266.970354c0-69.929676-56.890708-126.820384-126.815267-126.820384-17.248849 0-31.233352 13.985526-31.233352 31.233352s13.984503 31.233352 31.233352 31.233352c35.483142 0 64.348564 28.869514 64.348564 64.35368l0 266.970354-18.605753 0c-45.924959 0-83.289961 37.363979-83.289961 83.289961l0 103.024421c0 45.924959 37.363979 83.289961 83.289961 83.289961l103.034655 0c45.924959 0 83.289961-37.363979 83.289961-83.289961L959.856098 709.234083C959.854051 663.309124 922.490072 625.945145 876.565113 625.945145zM897.387347 812.258505c0 11.286044-9.537214 20.822235-20.822235 20.822235L773.530458 833.080739c-11.286044 0-20.822235-9.537214-20.822235-20.822235L752.708224 709.234083c0-11.286044 9.537214-20.822235 20.822235-20.822235l103.034655 0c11.286044 0 20.822235 9.537214 20.822235 20.822235L897.387347 812.258505z"
              fill="#f87c03"
              p-id="1618"
            ></path>
          </svg>
          <span style="color: #f87c03;">常见科室</span>
        </div>
        <div class="right">
          <span>全部</span>
          <svg
            t="1690022341692"
            class="icon"
            viewBox="0 0 1024 1024"
            version="1.1"
            xmlns="http://www.w3.org/2000/svg"
            p-id="2869"
            width="16"
            height="16"
          >
            <path
              d="M332.501333 183.168a42.666667 42.666667 0 0 1 57.621334-2.496l2.709333 2.496 298.666667 298.666667a42.666667 42.666667 0 0 1 2.496 57.621333l-2.496 2.709333-298.666667 298.666667a42.666667 42.666667 0 0 1-62.826667-57.621333l2.496-2.709334L600.96 512 332.501333 243.498667a42.666667 42.666667 0 0 1-2.496-57.621334l2.496-2.709333z"
              fill="#000000"
              p-id="2870"
            ></path>
          </svg>
        </div>
      </div>
      <div class="content">
        <ul>
          <li>qqqq</li>
          <li>wwww</li>
          <li>eeee</li>
          <li>rrrr</li>
          <li>rrrr</li>
          <li>rrrr</li>
          <li>rrrr</li>
        </ul>
      </div>
    </div>

    <!-- 平台公共 -->
    <div class="notice">
      <div class="header">
        <div class="left">
          <svg
            t="1690022807956"
            class="icon"
            viewBox="0 0 1024 1024"
            version="1.1"
            xmlns="http://www.w3.org/2000/svg"
            p-id="3956"
            width="16"
            height="16"
          >
            <path
              d="M800 255.9H685.2L589.4 160a110 110 0 0 0-155 0l-95.7 95.7H224a96.2 96.2 0 0 0-96 96V800a96.1 96.1 0 0 0 96 96H800a96.1 96.1 0 0 0 96-96V351.9a96.2 96.2 0 0 0-96-96z m-320-50a45.7 45.7 0 0 1 64.5 0l50 50.5H429.2zM832 800a32 32 0 0 1-32 32H224a32 32 0 0 1-32-32V351.9A32.1 32.1 0 0 1 224 320H800a32.1 32.1 0 0 1 32 32z"
              fill="#1296db"
              p-id="3957"
            ></path>
            <path
              d="M704 447.9H320a32 32 0 0 0 0 64h384a32 32 0 0 0 0-64zM512 640H320a32 32 0 1 0 0 64h192a32 32 0 1 0 0-64z"
              fill="#1296db"
              p-id="3958"
            ></path>
          </svg>
          <span style="color: #1296db;">平台公告</span>
        </div>
        <div class="right">
          <span>全部</span>
          <svg
            t="1690022341692"
            class="icon"
            viewBox="0 0 1024 1024"
            version="1.1"
            xmlns="http://www.w3.org/2000/svg"
            p-id="2869"
            width="16"
            height="16"
          >
            <path
              d="M332.501333 183.168a42.666667 42.666667 0 0 1 57.621334-2.496l2.709333 2.496 298.666667 298.666667a42.666667 42.666667 0 0 1 2.496 57.621333l-2.496 2.709333-298.666667 298.666667a42.666667 42.666667 0 0 1-62.826667-57.621333l2.496-2.709334L600.96 512 332.501333 243.498667a42.666667 42.666667 0 0 1-2.496-57.621334l2.496-2.709333z"
              fill="#000000"
              p-id="2870"
            ></path>
          </svg>
        </div>
      </div>
      <div class="content">
        <ul>
          <li>qqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqq</li>
          <li>wwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwww</li>
          <li>eeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeee</li>
        </ul>
      </div>
    </div>

    <!-- 停诊公告 -->
    <div class="stop">
      <div class="header">
        <div class="left">
          <svg t="1690028947093" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6119" width="16" height="16"><path d="M512 212l48.8 12c101.6 24.8 176 117.6 176 220.8v254.4l18.4 18.4 24.8 25.6h-536l24.8-25.6 18.4-18.4V444.8c0-103.2 73.6-196.8 176-220.8l48.8-12M512 64c-36.8 0-64 30.4-64 68v30.4C320.8 192 223.2 307.2 223.2 444.8v228.8L136 763.2v44.8h752v-44.8l-87.2-89.6V444.8c0-137.6-97.6-252.8-224.8-283.2v-28.8c0-32-17.6-60.8-48-67.2-5.6-1.6-11.2-1.6-16-1.6z m88 808H424c0 49.6 38.4 88 88 88s88-38.4 88-88z" p-id="6120" fill="#d81e06"></path></svg>
          <span style="color: #d81e06;">停诊公告</span>
        </div>
        <div class="right">
          <span>全部</span>
          <svg
            t="1690022341692"
            class="icon"
            viewBox="0 0 1024 1024"
            version="1.1"
            xmlns="http://www.w3.org/2000/svg"
            p-id="2869"
            width="16"
            height="16"
          >
            <path
              d="M332.501333 183.168a42.666667 42.666667 0 0 1 57.621334-2.496l2.709333 2.496 298.666667 298.666667a42.666667 42.666667 0 0 1 2.496 57.621333l-2.496 2.709333-298.666667 298.666667a42.666667 42.666667 0 0 1-62.826667-57.621333l2.496-2.709334L600.96 512 332.501333 243.498667a42.666667 42.666667 0 0 1-2.496-57.621334l2.496-2.709333z"
              fill="#000000"
              p-id="2870"
            ></path>
          </svg>
        </div>
      </div>
      <div class="content">
        <ul>
          <li>qqqqqqqq</li>
          <li>wwww</li>
          <li>eeee</li>
        </ul>
      </div>
    </div>
  </div>
</template>

<style lang="scss" scoped>
.tip {
  color: #7f7f7f;

  .header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 25px;

    span {
      margin: 0 10px;
    }
  }

  .deparment {
    .content {
      ul {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;

        li {
          width: 50%;
          margin-bottom: 20px;
        }
      }
    }
  }

  .content, .stop {
    ul {
      li {
        margin-bottom: 20px;
        display: inline-block;
        white-space: nowrap;
        width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
      }
    }
  }
}
</style>
